/* function aa(){
	alert('aaa');
}
aa(); */
//加载组件
//暴露函数
(function(win) {
	//核心function
	async function fetchAndParse(URL) {
		//改造
		let response = await fetch(URL);
		let html = await response.text();

		const parser = new DOMParser();
		const document = parser.parseFromString(html, 'text/html');
		const head = document.head;
		const template = head.querySelector('template');
		const style = head.querySelector('style');
		const script = head.querySelector('script');

		//返回的是一个promise，因为是该函数async函数	
		return {
			template,
			//style,
			script,
			url: URL
		};
	}

	async function getSettings({
		template,
		script,
		url
	}) {
		//获取js的源码
		let source = script.textContent;

		//转化为blob对象，动态导入模块
		const myJSFile = new Blob([source], {
			type: 'application/javascript'
		});
		const myJSURL = URL.createObjectURL(myJSFile);
		//动态导入模块
		/* import(myJSURL).then((module) => {
			console.log(module.default); // true
		}); */

		let module = await import(myJSURL);

		//获取vue配置选项
		let vueOptions = module.default;
		//添加模板选项
		vueOptions.template = template;
		return vueOptions; //返回一个promise
	}


	async function loadAndSettings(url) {
		let options = await fetchAndParse(url);
		//返回的是一个异步组件的配置
		let config = await getSettings({ ...options
		});
		return config;
	}

	
	function vload(url) {
		//具体的渲染函数
		function render() {
			return {
				// 需要加载的组件 (应该是一个 `Promise` 对象)
				component: loadAndSettings(url), //
				// 异步组件加载时使用的组件
				//loading: LoadingComponent,
				loading: {template:'<p>loading...</p>'},
				// 加载失败时使用的组件
				//error: ErrorComponent,
				error: {template:'<p>error...</p>'},
				// 展示加载时组件的延时时间。默认值是 200 (毫秒)
				delay: 200,
				// 如果提供了超时时间且组件加载也超时了，
				// 则使用加载失败时使用的组件。默认值是：`Infinity`
				timeout: 3000
			}
		}
		return render;
	
		//es6箭头函数写法
		/* return () => ({
			// 需要加载的组件 (应该是一个 `Promise` 对象)
			component: loadAndSettings(url), //
			// 异步组件加载时使用的组件
			loading: LoadingComponent,
			// 加载失败时使用的组件
			error: ErrorComponent,
			// 展示加载时组件的延时时间。默认值是 200 (毫秒)
			delay: 200,
			// 如果提供了超时时间且组件加载也超时了，
			// 则使用加载失败时使用的组件。默认值是：`Infinity`
			timeout: 3000
		}) */
	}
	function vtag(tagName, url) {
		loadAndSettings(url);
		Vue.component(tagName,vload(url));
	}

	//es6中的对象可以这么写vtag作为变量名
	//这里是暴露到全局的函数
	win.xvue = {
		vtag,
		vload
	};
})(window);

//window是
